<template>
  <!-- 合并操作 -->
  <u-dialog :title="title" :show.sync="show" width="1040px" :auto-close="false" :footer="true" @cancel="cancel" @confirm="confirm">

    <el-form ref="dataForm" :rules="rules" :model="dataForm" label-width="100px">
      <el-row>
        <el-form-item prop="name" label="查询条件">
          <el-input v-model="listQuery.content" placeholder="请输入查询内容" clearable>
            <el-select slot="prepend" v-model="listQuery.type" placeholder="请选择条件查询" clearable>
              <el-option label="根据保留手机号查询会员" :value="1" />
              <el-option label="根据保留卡号查询会员" :value="2" />
              <el-option label="根据作废手机号查询会员" :value="3" />
              <el-option label="根据作废卡号查询会员" :value="4" />
            </el-select>
            <el-button slot="append" icon="el-icon-search" @click="handleQuery()" />
          </el-input>
        </el-form-item>

        <el-col :span="12">
          <el-form-item prop="card_no" label="保留卡号">
            <el-input v-model="dataForm.card_no" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="mobile" label="保留手机号">
            <el-input v-model="dataForm.mobile" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="level_name" label="会员等级">
            <el-input :value="dataForm.level_name" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="openid" label="保留OPENID">
            <el-input :value="dataForm.openid" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="credit" label="积分">
            <el-input :value="dataForm.credit" placeholder="无数据" disabled clearable />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="oldcard_no" label="作废卡号">
            <el-input v-model="dataForm.oldcard_no" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="oldmobile" label="作废手机号">
            <el-input v-model="dataForm.oldmobile" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="oldlevel_name" label="会员等级">
            <el-input :value="dataForm.oldlevel_name" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="oldopenid" label="作废OPENID">
            <el-input :value="dataForm.oldopenid" placeholder="无数据" disabled clearable />
          </el-form-item>
          <el-form-item prop="oldcredit" label="积分">
            <el-input :value="dataForm.oldcredit" placeholder="无数据" disabled clearable />
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item prop="note" label="积分权益">
        <el-tooltip class="item" effect="dark" content="是否合并积分权益" placement="top-start">
          <el-switch v-model="dataForm.transfer_credit" />
        </el-tooltip>
      </el-form-item>

    </el-form>

    <el-alert
      title="温馨提示"
      type="success"
      description="保留会员卡会检查会员状态是否正常，如果是作废状态则会更改为正常状态；作废会员卡会解除OPNEID绑定，并重置手机号为11111111111，并将原有的手机号设定到姓名字段，状态更改为作废状态。"
      show-icon
      :closable="false"
    />

  </u-dialog>

</template>

<script>
/**
 * 业务组件 - 合并操作
 */
export default {
  name: 'Merge',
  model: {
    prop: 'show',
    event: 'changeShow'
  },
  props: {
    /** 是否弹框 */
    show: {
      type: Boolean,
      default: false
    },
    /** 选中的数据 */
    data: {
      type: Object,
      default: data => {
        return ({
          card_id: '',
          member_name: ''
        })
      }
    }
  },
  data() {
    return {
      api: this.$u.api.Member,
      title: '会员合并',
      dataForm: {
        card_id: '',
        card_no: '',
        card_type: '',
        level_name: '',
        mobile: '',
        openid: '',
        credit: '',
        oldcard_id: '',
        oldcard_no: '',
        oldcard_type: '',
        oldlevel_name: '',
        oldmobile: '',
        oldopenid: '',
        oldcredit: '',
        transfer_credit: false
      },
      rules: {
        card_no: [
          { required: true, message: '请查询保留会员卡号', trigger: ['blur'] }
        ],
        oldcard_no: [
          { required: true, message: '请查询作废会员卡号', trigger: ['blur'] }
        ]
      },
      listQuery: {
        type: 1,
        content: ''
      }
    }
  },
  watch: {
    show(newVal, oldVal) {
      // 监听是否弹框,决定是否初始化数据
      // console.log(newVal + '---------------' + oldVal)
      if (newVal) {
        // 清除表单验证状态
        const self = this
        // 初始化查询数据
        self.listQuery = {
          type: 1,
          content: ''
        }
        // 初始化数据源
        self.dataForm = {
          card_id: '',
          card_no: '',
          card_type: '',
          levelname: '',
          mobile: '',
          openid: '',
          credit: '',
          oldcard_id: '',
          oldcard_no: '',
          oldcard_type: '',
          oldlevel_name: '',
          oldmobile: '',
          oldopenid: '',
          oldcredit: '',
          transfer_credit: false
        }
        self.$nextTick(() => {
          self.$refs['dataForm'].clearValidate()
        })
      }
    }
  },
  methods: {
    // 查询单个会员数据
    handleQuery() {
      this.api.query(this.listQuery).then(res => {
        const { card_id, card_no, card_type, level_name, mobile, openid, credit } = res.data

        if (this.listQuery.type === 1 || this.listQuery.type === 2) {
          const d = {
            card_id,
            card_no,
            card_type,
            level_name,
            mobile,
            openid,
            credit
          }
          // 保留会员
          this.dataForm = Object.assign(this.dataForm, d)
        } else {
          const d = {
            oldcard_id: card_id,
            oldcard_no: card_no,
            oldcard_type: card_type,
            oldlevel_name: level_name,
            oldmobile: mobile,
            oldopenid: openid,
            oldcredit: credit
          }
          // 作废会员
          this.dataForm = Object.assign(this.dataForm, d)
        }
        console.log('打印数据：' + JSON.stringify(this.dataForm))
        this.$u.msg('查询成功')
      })
    },
    // 确认
    confirm() {
      const self = this
      self.$refs['dataForm'].validate((valid) => {
        if (valid) {
          self.$confirm('此操作将合并保留 【' + self.dataForm.card_no + '】，作废【' + self.dataForm.oldcard_no + '】，是否继续？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => {
            self.api.merge(self.dataForm).then(() => {
              // 通知信息
              self.$u.msg('合并成功')
              // 双向绑定数据
              self.$emit('changeShow', false)
              // 更新成功后传递
              self.$emit('change')
            })
          }).catch(() => {
          })
        }
      })
      this.$emit('confirm')
    },
    // 关闭或者取消
    cancel() {
      this.$emit('changeShow', false)
      this.$emit('cancel')
    }
  }
}
</script>

